<template>
  <div>
    <transition name="router-fade" mode="out-in">
      <keep-alive>
        <router-view v-if="$route.meta.keepAlive"></router-view>
      </keep-alive>
    </transition>
    <transition :name="'vux-pop-'+ animate">
      <router-view class="vue-view" v-if="!$route.meta.keepAlive"></router-view>
    </transition>
  </div>
</template>

<script>
  import {mapState} from 'vuex'

  export default {
    data() {
      return {
//        inviter: this.$route.query.inviter || this.$utils.getQueryString('inviter') || null,
//        mainPage: ['home', 'cart-list', 'distinguish', 'integral-mall', 'my'],
        memberInfo: this.$storage.getMemberInfo()
      }
    },
    created() {
    },
    computed: {
      ...mapState({
        animate: function (state) {
          return state.vux.animate
        } // 动画
      })
    },
    mounted() {
//      document.body.addEventListener('touchstart', function () {}) // 解决在ios下，a标签带hover伪类的按钮需要点击两次才生效的问题
//      console.log('inviter', this.inviter)
//      if (this.inviter) {
//        this.$request.integralAddByShareFriend(this.inviter).then((data) => {
//          console.log('分享者获得积分', data)
//        })
//      }
//      console.log('app page')
      // 网易七鱼聊天客户配置
      if (this.memberInfo) {
//        ysf.config({ // eslint-disable-line
//          uid: this.memberInfo.member_id,
//          name: this.memberInfo.member_name,
//          mobile: this.memberInfo.member_mobile
//        })
      }
    },
    methods: {}
  }
</script>
<style>
  .mint-msgbox-btn.mint-msgbox-confirm, .mint-msgbox-btn.mint-msgbox-cancel {
    font-size: 16px;
    color: #45a73a
  }

  .mint-msgbox-btn.mint-msgbox-confirm:active, .mint-msgbox-btn.mint-msgbox-cancel:active {
    color: #45a73a
  }

  .mint-header {
    color: #45a73a
  }

  .bg-white {
    background-color: #fff !important;
  }

  .bg-gray {
    background-color: #efeff4 !important;
  }

  input[type="search"]::-webkit-search-cancel-button {
    display: none;
  }

  .mint-swipe-indicator.is-active {
    background: #45a73a !important;
    opacity: 1 !important;
  }

  .mint-swipe-indicator {
    opacity: 0.3 !important;
  }

  .vue-view {
    width: 100%;
  }

  .vux-pop-out-enter-active,
  .vux-pop-out-leave-active,
  .vux-pop-in-enter-active,
  .vux-pop-in-leave-active {
    will-change: transform;
    transition: all 400ms;
    -webkit-transition: all 400ms;
    height: 100%;
    position: absolute;
    backface-visibility: hidden;
    perspective: 1000;
    -webkit-perspective: 1000;
  }

  .vux-pop-out-enter {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }

  .vux-pop-out-leave-active {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }

  .vux-pop-in-enter {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
    -webkit-transform: translate3d(100%, 0, 0);
  }

  .vux-pop-in-leave-active {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
    -webkit-transform: translate3d(-100%, 0, 0);
  }
</style>
